<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css"/>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/general.css"/>
		<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css"/>
		<link rel="stylesheet" type="text/css" href="../css/mui.poppicker.css"/>
		<style type="text/css">
			.content{
				width: 100%;
				background-color: #F2F2F2;
				padding: 10px;
			}
			.search{
				display: flex;
				justify-content: center;
				align-content: center;
				padding: 10px;
				background-color: white;
			}
			.stext{
				width: 25%;
				text-align: center;
				display: flex;
				justify-content: center;
				align-items: center;
				border-right:1px solid #C7C7CC;
			}
			.simg{
				width: 30px;
				height: 30px;
			}
			.simg>img{
				width: 100%;
				height: 100%;
			}
			.ssdiv{
				width: 75%;
			}
			.ssinp{
				width: 100%;
				height: 100%;
				border: 0;
				padding-left: 10px;
			}
			::-webkit-input-placeholder{
				font-size: 0.8em;
				color: #999999;
			} 
			.sjx{
				margin: auto;
				width: 0;
				height: 0;
			    border:10px solid transparent;
				border-top: 10px solid #000000;
				position: relative;
				top: 20%;
			}
			.butclass{
				width: 90%;
				margin: auto;
			}
			.maindiv>div{
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-content: center;
				padding: 0.2em;
			}
			
			
			
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left colorw"></a>
		    <h1 class="mui-title" id="title">选择会员</h1>
		</header>
		<div class="mui-scroll-wrapper mui-content" id="refreshContainer">
			<div class="mui-scroll">
		    <div class="content">
		    	<div class="search">
		    		<div class="stext fe09" id="stext">
		    			手机
		    			<div class="sjx">
		    			</div>
		    		</div>
		    		<div class="ssdiv">
		    			<form action="" onkeydown="if(event.keyCode==13)return false;">
		    				<input id="keyvalue" class="ssinp" type="" name="" id="" value=""  placeholder="请输入手机号/卡号/姓名"/>
		    			</form>
		    		</div>
		    		<div class="simg" id="smid">
		    			<img src="../img/saomiao.png"/>
		    		</div>
		    	</div>
		    </div>
		    	
		    		<div class="main" id="mianlist">
		    	
		    		</div>
		    		<div class="morediv hidden" id="moreid">
				   		<span id="more_list">更多</span>
				   	</div>
		    		<div id="" class="fgd"></div>
		    	</div>
		    	<div class="footdiv hidden" id="cashier">
		    		<button type="button" class="mui-btn mui-btn-blue mui-btn-block">散客消费</button>
			    </div>
		    	
		</div>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/mui.picker.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.poppicker.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/city.data.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/setStopped.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var page = 0,//分页参数
			type = "phone",//参数类型
			mlist = [],			//会员列表
			gotype = "";//跳转路径
			window.onload = function(){
				mui.init({
					 pullRefresh: {
				        container: '#refreshContainer',
				        down: {
				        	height:50,//可选,默认50.触发下拉刷新拖动距离,
					        auto: false,//可选,默认false.首次加载自动下拉刷新一次
					        contentdown : "下拉可以刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
					        contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
					        contentrefresh : "正在刷新...",
				            callback: pulldownRefresh
				        },
				        up:{
				        	callback: pullupRefresh
				        }
				    }
				});
				
				function pullupRefresh(){
					more_list();
					mui('#refreshContainer').pullRefresh().endPullupToRefresh();
				}
				function pulldownRefresh(){
					page = 1;
		      		mlist = [];
		      		upToRefresh();
		      		getmemberlist();
				}
				
				
				//更多
				g("more_list").addEventListener("tap",function(){
					more_list();
				})
				
				//memberInformation 次卡扣减
				//fastCharge 充值管理
				//forGoods 积分兑换
				gotype = getrequest().gotype;
				mui.plusReady(function(){
					var view = plus.webview.currentWebview();
					gotype = view.gotype;
				})
				console.log(gotype);
				if(gotype == 'cashier'){
					g("cashier").classList.remove("hidden");
					g("cashier").addEventListener("tap",function(e){
						gopage("cashier");
					})
				}
				
				
						var stextPicker = new mui.PopPicker();
			                stextPicker.setData([{
			                    value: 'phone',
			                    text: '手机'
			                }, {
			                    value: 'card_number',
			                    text: '卡号'
			                }, {
			                    value: 'username',
			                    text: '昵称'
			                }, {
								value: 'plate_number',
								text: '车牌号'
							}]);
			                var stext = document.getElementById('stext');
			                stext.addEventListener('tap', function(event) {
			                	mui('#refreshContainer').pullRefresh().setStopped(true);//暂时禁止滚动
			                    stextPicker.show(function(items) {
			                        stext.innerHTML = items[0].text + '<div class="sjx"></div>';
			                        type = items[0].value;
			                        page = 1;
			                        mlist = [];
			                    });
			            }, false);
			            
			           g("smid").addEventListener("tap",function(e){
		                    mui.openWindow({
		                        url: '../general/scanning-page.html',
		                        id: 'scanning-page',
		                        show: {
		                            aniShow: 'zoom-fade-in',
		                            duration: 300
		                        },
		                        waiting: {
		                            autoShow: true
		                        }
		                });
			           	
			           })
			           // getmemberlist();		
				
				document.onkeydown=function(event){
					var e = event || window.event || arguments.callee.caller.arguments[0];
					if(e && e.keyCode==13){
						page = 1;
			    		mlist = [];
						getmemberlist();
						}
					}
				//getmemberlist();
				}
			
			//更多
			function more_list(){
				console.log("更多")
				page++;
                getmemberlist();
			}
			
			function fuzzy_search(){
				var data = {
					url:"/api/member/fuzzy_search",
					data:{
						access_token:acctoken(),
						key:g("keyvalue").value||"",
						type:type
					}
				}
				ajax(data,function(res){
					console.log("查找的会员",res);
					setmainlist(res.data.data);
					//mui('.mui-scroll-wrapper').scroll().scrollTo(0,0,100);
				})
				
				
			}
			
			//获取会员信息列表
			function getmemberlist(){
						var data = {
							url:"/api/member/lst",
							data:{
								access_token:acctoken(),
								key:g("keyvalue").value||"",
								type:type,
								page:page>0?page:1,
							}
						}
						ajax(data,function(res){
							console.log("会员列表",res)
						let list = res.data.data;
						if(list.length){
							list.forEach(function(item,index){
								mlist.push(item);
							})
							mlist = remove_duplicate(mlist);
							setmainlist(mlist);
							$("#moreid").removeClass("hidden");
						}else{
							if(page == 1){
								let str = `<div class="nolistdiv">暂无记录<div>`
								g("mianlist").innerHTML = str;
							}else{
								mui('#refreshContainer').pullRefresh().disablePullupToRefresh();
								mui('#refreshContainer').pullRefresh().refresh(false);
								page--;
								$("#moreid").addClass("hidden");
								mui.toast('没有更多数据了');
							}
						}
						
							
						})
						
					}
			
			//扫描子页面调用，查找会员
			function setcard_number(scan){
				console.log("回调")
				g("stext").innerHTML = '卡号<div class="sjx"></div>';
			    type = 'card_number';
				g("keyvalue").value = scan;
				page = 1;
			    mlist = [];
				getmemberlist();
			}
			
			//查找会员 旧借口
					function getmember(scan){
						var data = {
							url:"/api/member/search",
							data:{
								access_token:acctoken(),
								key:g("keyvalue").value||"",
								type:type
							}
						}
						ajax(data,function(res){
							console.log("查找的会员",res);
							setmainlist(res.data.data);
							mui('.mui-scroll-wrapper').scroll().scrollTo(0,0,100);
						})
					}
					function setmainlist(data){
						var str = ''
						if(data.length > 0){
							str = '<ul class="mui-table-view">';
							for(var i = 0 ; i < data.length; i++){
					    		str +=  '<li class="mui-table-view-cell mui-media" data-mid="'+data[i].id+'" data-mname="'+data[i].username+'">'+
						   			    '<a href="javascript:;">'+
						   			    '<img class="mui-media-object mui-pull-left border50" src="';
						   			    
				   			    if(data[i].images&&data[i].images.path_name){
				   			    	str += data[i].images.path_name;
				   			    }else{
				   			    	str += '../img/member-header.png';
				   			    }
				   			    
				   			    str += '">'+
					   			    '<div class="mui-media-body">'+
					   			    data[i].username+
					   			    '<p class="mui-ellipsis">'+
					   			    data[i].phone+ ' | '+data[i].card_number+
					   			    '</p></div></a></li>';	
							}
							str += '</ul>';
						}else{
							str ='<div class="nolistdiv">暂无数据</div>';
						}
						g("mianlist").innerHTML = str;
						$(".mui-table-view").on("tap",".mui-table-view-cell",function(e){
							var mid = e.currentTarget.dataset.mid;
							var mname = e.currentTarget.dataset.mname;
	                        gopage(gotype,mid);
						})
						
					}
					
					function gopage(url,mid){
						var list = {mid:mid||0};
						mui.openWindow({
							url: '../workbench/'+url+'.html?mid='+mid||0,
							id: url,
							extras:list
						})
					}
					
		</script>
	</body>

</html>